import React from 'react';
import { Link } from 'react-router-dom';
import { Form, Icon, Input, Button, Modal, Row, Col, Tooltip, Carousel, Divider, message, Checkbox, Popover } from 'antd';
import { Aes } from '../../tools/index';
import { $http } from '../../containers/config/https';
import { httpConfig } from '../../containers/config/httpConfig';
// import { FaceIDStart, FaceIDEnd } from '../../components/faceID/FaceID';
import store from '../../store';
import fetchJsonp from 'fetch-jsonp';

import Register from 'pages/register/Register.jsx'
import DepartmentList from './components/DepartmentList';

import '../../assets/css/login.css'
import '../../components/faceID/FaceID.css';

import logoDefImg from 'assets/images/pr-login-logo.png';
import loginLogo from 'assets/images/pr-login-logo.png';

const DisSvg = () => (
    <svg width="1em" height="1em" fill="currentColor" viewBox="0 0 1024 1024">
        <path d="M153.60048 972.8c0-9.42 7.68-17.05 17.05-17.05h68.3a221.85 221.85 0 0 0 200.705-181.094 200.858 200.858 0 0 0 127.642 0A221.85 221.85 0 0 0 785.05048 955.75h68.3c9.422 0 17.05 7.63 17.05 17.05l-40.652 50.38c57.702-35.942 88.32-54.015 91.853-54.271V955.75c0-3.532-0.359-7.014-1.024-10.444a2.406 2.406 0 0 1 0-1.178 51.2 51.2 0 0 0-13.67-24.422A51.2 51.2 0 0 0 870.40048 904.55h-85.35a170.65 170.65 0 0 1-169.473-151.756c67.072-40.244 118.272-115.2 139.776-206.644h-52.531C672.41048 655.872 594.79048 733.85 503.45048 733.85c-91.29 0-168.96-77.978-199.321-187.7h-52.583c22.22 91.444 73.42 166.4 139.776 206.644A170.65 170.65 0 0 1 221.85048 904.55H153.60048a51.2 51.2 0 0 0-48.127 34.304 127.693 127.693 0 0 0-3.072 16.896v13.108c34.15 36.761 51.2 38.092 51.2 3.942z m349.85-819.2c104.96 0 192 102.4 209.767 238.95h51.2C745.47348 228.352 636.05848 102.4 503.45048 102.4c-132.608 0-241.971 125.952-261.273 290.15h51.2C311.45048 256 398.49048 153.6 503.45048 153.6z" fill="#606889" p-id="2252"></path><path d="M49.97248 686.746v184.832c0 50.841 49.92 101.632 99.84 101.632h148.377a24.934 24.934 0 0 1 26.47 25.344A25.19 25.19 0 0 1 299.72648 1024H132.61048C59.54648 1024 0.00048 963.584 0.00048 889.14V685.772a25.242 25.242 0 0 1 24.985-25.395 25.19 25.19 0 0 1 24.986 26.368z m0-349.492v0.922a25.19 25.19 0 0 1-24.986 25.446A25.242 25.242 0 0 1 0.00148 338.227V134.861C0.00048 60.416 59.54648 0 132.60948 0h167.168c13.772 0.102 24.883 11.418 24.883 25.446a25.19 25.19 0 0 1-26.47 25.344H149.86248c-50.022 0-99.891 50.79-99.891 101.632v184.832z m924.057 349.492v-0.922c0-14.029 11.162-25.446 24.986-25.446 13.773 0 24.934 11.366 24.986 25.395v203.366C1024.00048 963.584 964.45548 1024 891.39348 1024H724.22548a25.19 25.19 0 0 1-24.884-25.446 25.19 25.19 0 0 1 26.47-25.344h148.327c49.971 0 99.891-50.79 99.891-101.632V686.746z m0-349.492V152.422c0-50.841-49.92-101.632-99.84-101.632H725.81248a24.934 24.934 0 0 1-26.47-25.344A25.19 25.19 0 0 1 724.27548 0h167.117C964.45548 0 1024.00048 60.416 1024.00048 134.86v203.367a25.242 25.242 0 0 1-24.986 25.395 25.19 25.19 0 0 1-24.986-26.368zM781.21048 486.4c18.125 0 32.87 11.571 32.973 25.6 0 14.182-14.848 25.6-32.973 25.6H232.85848c-18.33 0-33.075-11.52-33.075-25.6 0-14.182 14.9-25.6 33.024-25.6h548.352z" fill="#606889" p-id="2253"></path>
    </svg>
);

const DisIcon = props => (
    <Icon component={DisSvg} {...props} />
);

class Login extends React.Component {
    constructor(props) {
        super(props)
        this.setDepartmentValues = this.setDepartmentValues.bind(this);
        this.enterInputNextFocus = this.enterInputNextFocus.bind(this);
        this.handleEnterPassword = this.handleEnterPassword.bind(this);
        var userData = JSON.parse(sessionStorage.getItem('userData'));
        this.state = {
            userData,
            visible: false, //科室框
            visibleIp: false, //本地服务IP
            modalTop: 0,    //科室框位置
            modalHeight: 0,    //科室框高度
            visibleCode: 'none',// 验证码框
            disabled: true, //科室框禁用
            defaultValues: {      //向子组件传值
                userCode: '',  //用户工号
                departmentId: '',  //默认科室
                userId: '',      //用户id
            },
            selectedValue: '', /**选择的部门 */
            currentSelectedValue: undefined,
            codeHelp: '',     //自定义验证码内容
            codeStatus: '',   //自定义验证码状态
            depId: '',            //角色科室id
            loginId: '',            //科室id
            groupId: '',            //角色id
            hospDrId: '',            //医院id
            defaultVisible: false,    //显示提示tip
            updateParentButtonData: '',   //科室组件传值
            userLogonType: '',  //登录类型
            contentH: '',  //content高度
            contentW: "", //content宽度
            verificationCode: '', //验证码
            openSelect: false,    //科室select
            bakUserName: "", /**缓存用户名 */
            bakPassword: "", /**缓存密码 */
            qR: '', /**扫描软件名 */
            QRImg: '', /**扫描软件名 */
            qRVis: false,
            qRTime: 60,
            translate3d: 0,
            streaming: false, // 是否开始捕获媒体
            imageUrl: '', // 图片base64
            faceValue: '', // 图片特征码
            faceUserID: '', // 图片用户ID
            timeSum: 10, // 人脸识别次数
            faceUserData: {}, // 人脸识别对象
            languageCode: 'CN',// 国际化标识
            faceTrue: false, // 是否识别成功
            languageData: {}, // 国际化语言包
            language: {},   // 国际化语言
            liked: true,
            count: 60,
            switchType: "login",
            userNameList: [],
            isSaveUserName: true,
            popoverVisible: false,
            groupType: '', // 角色类型
        }
    }

    componentDidMount() {
        /**
         * @ByYQL: 访问权限限制
         * Create 2022-8-9
         */
        let windowHost = window.location && window.location.protocol && window.location.host ? (window.location.protocol + '//' + window.location.host) : (window.location && window.location.origin ? window.location.origin : '');
        let hashStr = window.location?.hash || ''; // 外网地址存在视光免登陆查看订单参数情况
        //关闭外网权限 np.h03.p0551.com
        if (windowHost.indexOf('np.h03.p0551.com') != -1 && (hashStr.indexOf('/login') > -1 || hashStr.indexOf('/Login') > -1)) {
            this.props.history.replace('/limitcontrol');
        }

        // var data = {
        //     width: '500px', //  video宽
        //     height: '500px', //  video高
        //     autoPlay: false, // 是否是自动识别验证
        //     timeSum: 10, // 人脸自动识别验证次数
        //     faceType: 'User', // 人脸类型
        //     videoScreenshot: function (imgBaseb4) { // 获取截图base64格式返回值
        //         console.log('faceID插件外部获取base64格式返回值' + imgBaseb4)
        //     }
        // }

        // FaceIDStart(data)  // 开启摄像头
        // // FaceIDEnd()  // 关闭
        let isSaveUserName = window.localStorage.getItem('isSaveUserName') ? (window.localStorage.getItem('isSaveUserName') === 'Y' ? true : false) : true;
        let userNameList = window.localStorage.getItem('userNameList') ? JSON.parse(window.localStorage.getItem('userNameList')) : [];
        // console.log("userNameList", isSaveUserName, userNameList)
        this.setState({ isSaveUserName, userNameList });
        store.dispatch({
            type: 'userData',
            value: { loginIs: 'N' }
        });
        store.dispatch({
            type: 'downloadTask',
            value: {}
        });
        sessionStorage.clear(); // 清空sessionStorage
        if (localStorage.getItem('province') != null) {
            localStorage.removeItem("province");
        } if (localStorage.getItem('city') != null) {
            localStorage.removeItem("city");
        }
        this.contentHeight();   // 获取content的高度
        this.setInputFocus(this.userName);
        // 修改表单的值
        if (this.props.location.state) {
            this.setInputFocus(this.passWord);
            this.props.form.setFieldsValue({
                userName: this.props.location.state.userCode ? this.props.location.state.userCode : ''
            });
        }
        // 是否是pc端
        if (this.IsPC()) {
            typeof (CefSharp) != "undefined" ? this.CefSharp() : this.getLocalIpConfig()
        } else {
            // 移动端专用获取不到MAC地址的 先固定一个MAC地址
            var fixedMAC = { "hostName": "移动端专用", "ipv4": "172.18.17.9", "ipv6": "172.18.17.9", "mac": "9C-5C-8E-C1-5C-D1" }
            window.sessionStorage.setItem("ipConfig", JSON.stringify(fixedMAC));
        }
        // this.getRequestAddress() /** 设置请求ip地址*/
        window.sessionStorage.setItem("loginIsSession", 'N');
        /**监听body click，隐藏 departmentList选择列表 */
        document.body.addEventListener("click", this.setStatus);
        this.CNEN() // 国际化
        this.getLogo();
        document.title = httpConfig && httpConfig.documentTitle ? httpConfig.documentTitle : "普瑞眼科HIS"; // 修改项目title
    }

    getLogo = () => {
        var data = {
            params: [{
                fileName: "logo.png"
            }]
        }
        $http.post('urlDeault', this, {
            code: "01040214",
            data: data,
            success: function (res) {
                if (+res.errorCode === 0) {
                    let imgUrl = ''
                    if (res.result) {
                        imgUrl = `${res.result}`
                    } else {

                    }
                    this.setState({
                        imgUrl: imgUrl && imgUrl || logoDefImg
                    })
                } else {
                    this.setState({
                        imgUrl: logoDefImg
                    })
                }
            }, error: function (res) {
                this.setState({
                    imgUrl: logoDefImg
                })
            }
        });
    }

    CefSharp = () => { // 新元素定制浏览器 获取本机IP信息
        if (CefSharp) {   // 新元素定制浏览器
            CefSharp.BindObjectAsync("xysCefToJavaScripts");
            setTimeout(() => {
                xysCefToJavaScripts.driveLocalHardware("{'inputDir':'GetIP/GetIP.dll','clsName':'GetIP.GetIPConfig','funcName':'IPConfig'}").then((returnVale) => {
                    if (returnVale && JSON.parse(returnVale).result) {
                        window.sessionStorage.setItem("ipConfig", JSON.stringify(JSON.parse(returnVale).result));
                    } else {
                        this.getLocalIpConfig()  /**获取本机IP信息 */
                    }
                })
            }, 100);
        } else {
            // 常规浏览器
            this.getLocalIpConfig()  /**获取本机IP信息 */
        }
    }

    checkfileUpdate = () => {  ///判断更新文件,下载文件如dll
        let windowHost = window.location && window.location.protocol && window.location.host ? (window.location.protocol + '//' + window.location.host) : (window.location && window.location.origin ? window.location.origin : "");
        // 判断是否是本地，如果是本地的话取https配置地址，线上则取地址栏地址 （内外网）
        let url = windowHost && (windowHost.indexOf("localhost") !== -1 || windowHost.indexOf("127.0.0.1") !== -1) ? httpConfig.ipDeault : windowHost;
        if (CefSharp) {   // 定制浏览器
            CefSharp.BindObjectAsync("xysCefToJavaScripts");
            let dllInputdata = {
                params: [{
                    "hipIP": url,
                    "hipURL": httpConfig.urlAddress,
                    "hipAuthorization": httpConfig.authorizationToken,
                    "groupID": this.state.groupId,
                    "hospID": this.state.hospDrId,
                    "loginLocID": this.state.loginId,
                }],
                "code": "HIP14001"
            }
            setTimeout(() => {
                xysCefToJavaScripts.driveLocalUpdateLis(JSON.stringify(dllInputdata)).then((returnVale) => {
                    var res = JSON.parse(returnVale);
                })
            }, 100);
        }
    }

    /**获取本机IP信息 */
    getLocalIpConfig = () => {
        let data = 'input={"inputDir":"GetIP/GetIP.dll","clsName":"GetIP.GetIPConfig","funcName":"IPConfig"}'
        let that = this
        fetchJsonp('http://127.0.0.1:62534/XYSWCFService/DynamicLoadingDLL?' + '&' + data, {
            jsonpCallback: 'JsonCallback',
        })
            .then(function (response) {
                return response.json()
            }).then(function (json) {
                if (json && JSON.parse(json)) {
                    window.sessionStorage.setItem("ipConfig", JSON.stringify(JSON.parse(json).result));
                }
            }).catch(function (ex) {
                // 获取不到MAC地址的 先固定一个MAC地址
                // var fixedMAC = { "hostName": "这是一个没获取到服务从而固定的地址", "ipv4": "172.18.17.9", "ipv6": "172.18.17.9", "mac": "9C-5C-8E-C1-5C-D1" }
                // window.sessionStorage.setItem("ipConfig", JSON.stringify(fixedMAC));
                // that.setState({
                //     visibleIp: true
                // })
                that.lastIpConfig()

                return false
            })
    }

    lastIpConfig = () => {
        //获取当前网址
        var curWwwPath = window.document.location.href;
        //获取主机地址之后的目录
        var pathName = window.document.location.pathname;

        var pos = curWwwPath.indexOf(pathName);

        //获取主机地址，如： http://localhost:8083

        var localhostPaht = curWwwPath.substring(0, pos);
        fetch(`${localhostPaht}/localip`, {
            method: 'get',
            mode: 'cors',
            headers: {
                "Authorization": 'Basic aGlwOmhpcA==',
            },
        }).then((res) => {
            // 如果http状态码正常，则直接返回数据
            if (res.status !== 200) {
                throw res.status
            } else {
                let Data;
                Data = res.json()
                // console.log(res);
                return Data
            }
        }).then((res) => {
            // console.log(res);
            window.sessionStorage.setItem("ipConfig", JSON.stringify(res));
        }).catch((error) => {
            // 获取不到MAC地址的 先固定一个MAC地址
            //var fixedMAC = { "hostName": "", "ipv4": "", "ipv6": "", "mac": "" }
            var fixedMAC = { "hostName": "", "ipv4": "192.168.0.100", "ipv6": "192.168.0.100", "mac": "fe80::48a:d9c7:ac9" }
            window.sessionStorage.setItem("ipConfig", JSON.stringify(fixedMAC));
        });

    }

    // 国际化
    CNEN = () => {
        var data = {
            params: [{
                "reactCode": ['Login'],
                "compontName": "Login",
                "type": "C"
            }]
        }

        $http.post('urlDeault', this, {
            code: "01040073",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    this.setState({
                        languageData: res.result.language || {},  // 国际化语言包
                    }, () => {
                        this.LanCNEN(this.state.languageCode)
                    })
                }
            }
        });
    }

    LanCNEN = (code) => {
        let { languageData } = this.state
        this.setState({
            language: languageData[code]
        })
    }

    // 人脸识别
    faceID = () => {
        try {
            if (!(navigator && navigator.mediaDevices && navigator.mediaDevices.getUserMedia)) {
                message.error("当前浏览器没有摄像头权限，请先授权。");
                return;
            }
            let video = document.querySelector("#video");
            let canvas = document.querySelector("#canvas"); //
            let width = 600; //视频和canvas的宽度
            let height = 657; //
            let { streaming, language, timeSum } = this.state; // 是否开始捕获媒体
            let that = this
            clearInterval(this.timerID); // 移除定时器
            video.srcObject && video.srcObject.getTracks()[0].stop(); //关闭摄像头

            // 获取用户媒体,包含视频和音频
            navigator.mediaDevices.getUserMedia({ video: true })
                .then(stream => {
                    video.srcObject = stream; // 将捕获的视频流传递给video  放弃window.URL.createObjectURL(stream)的使用
                    video.play(); //  播放视频
                });

            // 监听视频流就位事件,即视频可以播放了
            video.addEventListener('canplay', function (ev) {
                if (!streaming) {
                    video.setAttribute('width', width);
                    video.setAttribute('height', height);
                    canvas.setAttribute('width', width);
                    canvas.setAttribute('height', height);
                    streaming = true;
                    that.setState({
                        streaming: streaming
                    })
                }
            }, false);
            // 添加定时器
            this.timerID = setInterval(() => {
                let video = document.querySelector("#video");
                if (timeSum == 0) {
                    message.error(language.LoginLoginErr7 && language.LoginLoginErr7.descripts, this.state.userData && this.state.userData.messageTime)
                    this.setState({
                        timeSum: 10
                    }, () => {
                        clearInterval(this.timerID); // 移除定时器
                        video.srcObject.getTracks()[0].stop(); //关闭摄像头
                    })
                } else {
                    this.tackcapture()
                    timeSum--;
                    this.setState({
                        timeSum: timeSum
                    })
                }
            },
                2000
            );
        } catch (error) {
            message.error("当前浏览器没有摄像头权限，请先授权。")
        }
    }

    tackcapture = () => {
        let video = document.querySelector("#video");
        let canvas = document.querySelector("#canvas");
        let context = canvas.getContext('2d');
        let { streaming } = this.state; // 是否开始捕获媒体
        // 需要判断媒体流是否就绪
        if (streaming) {
            context.drawImage(video, 0, 0, 600, 657);// 将视频画面捕捉后绘制到canvas里面
            this.setState({
                imageUrl: canvas.toDataURL('image/png')  // 将canvas的数据传送到img里
            }, () => {
                this.faceImg() // 人脸识别验证
            })
        }
    }

    // 人脸识别验证 登录
    faceImg = () => {
        let { imageUrl, language } = this.state
        let ifconfig = JSON.parse(window.sessionStorage.getItem("ipConfig"));
        let video = document.querySelector("#video");
        // 初始值下拉列表值
        let data = {
            "params": [
                {
                    "imageBase64": imageUrl.substring(imageUrl.indexOf(",") + 1),
                    "IP": ifconfig.ipv4,
                    "deviceID": ifconfig.hostName,
                    "mac": ifconfig.mac,
                }
            ]
        };
        $http.post('urlDeault', this, {
            code: "01040113",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    clearInterval(this.timerID); // 移除定时器
                    video.srcObject.getTracks()[0].stop(); //关闭摄像头
                    this.setState({
                        faceUserData: res.result[0] || {},
                        faceTrue: true
                    }, () => {
                        /**设置查询修改ip地址 */
                        this.getIpAddressByHospitalId(res.result[0].hospID, res);
                        message.success(language.LoginLoginFaceSuccess && language.LoginLoginFaceSuccess.message, 1)
                    })
                }
            }
        });

    }

    /**
     * @ByShiZi: 登录前询问是否保存用户名
     * Create 2022-07-15
     * */
    handleISSaveUserName = (res) => {
        let { isSaveUserName, userNameList } = this.state;
        if (isSaveUserName) {
            // Modal.confirm({
            //     title: '账号保存提醒',
            //     content: '是否需要保存当前登录账号？',
            //     okText: '保存',
            //     cancelText: '取消',
            //     onOk: () => {

            //     },
            //     onCancel() { },
            // });
            let userName = this.props.form.getFieldValue('userName');
            if (userNameList.length > 2) { // 只保存三个
                userNameList.shift();
            }
            if (userNameList && userNameList.indexOf(userName) < 0) {
                userNameList.push(userName);
                window.localStorage.setItem('userNameList', JSON.stringify(userNameList))
            }
        };
        this.loginHref(res);
    }

    // 登录方法
    loginHref = (res) => {
        let userData = Object.assign({}, res.result[0])
        let { languageCode } = this.state
        userData.language = languageCode
        userData.messageTime = 1 // 提示显示的时间

        window.sessionStorage.setItem("loginIsSession", 'Y');
        window.sessionStorage.setItem("userData", JSON.stringify(userData));
        store.dispatch({
            type: 'userData',
            value: { loginIs: 'Y' }
        })
        // document.title = userData && userData.groupDesc ? userData.groupDesc : "普瑞眼科HIS"; // 修改项目title
        if (res.result[0].path != '') {
            // this.props.history.push(res.result[0].path);
            this.props.history.push({ pathname: res.result[0].path, state: { params: res.result[0]?.paras || '' } });
        } else {
            this.props.history.push("/001");
        }
    }

    // 判断是否是PC端
    IsPC = () => {
        var userAgentInfo = navigator.userAgent;
        var Agents = ["Android", "iPhone",
            "SymbianOS", "Windows Phone",
            "iPad", "iPod"];
        var flag = true;
        for (var v = 0; v < Agents.length; v++) {
            if (userAgentInfo.indexOf(Agents[v]) > 0) {
                flag = false;
                break;
            }
        }
        return flag;
    }

    setStatus = (event) => {
        if (event.target.name == 'department') {
            return;
        }
        this.setState({ openSelect: false })
    }

    componentWillUnmount() {
        /**移除监听body click*/
        document.body.removeEventListener("click", this.setStatus);
    }

    onRef = (ref) => {
        this.child = ref;
    }

    /** 设置请求ip地址*/
    getRequestAddress = () => {
        let script = document.querySelector('#script');
        if (script) {
            return;
        }
        script = document.createElement('script');
        script.id = 'script';
        script.src = 'src/containers/config/publicUnpackConfig.js';
        document.querySelector('body').appendChild(script);
    }

    /** 根据用户名、密码，获取当前用户下的所有角色、科室信息 */
    handleEnterPassword = (e) => {
        if (e.keyCode === 13) {
            this.handlePreLogin(e);
        }
    }

    // 预登录
    handlePreLogin = (e, callback) => {
        if (!this.state.selectedValue || this.state.selectedValue === "") {
            this.getDepartmentListByLogin(e, callback);
        } else {
            this.handleSubmit(e);
        }
    }

    /** input输入完成，按enter键 把焦点focus给下一个input */
    enterInputNextFocus = (event, nextInput, name) => {
        // if (event.keyCode === 13) {
        //     if (this.props.form.getFieldValue(name)) {
        //         let { input } = nextInput; /** 如果是textArea的话，const { textAreaRef } = this.passWord;*/
        //         input.focus();
        //     }
        // }

        if (this.props.form.getFieldValue(name)) {
            let { input } = nextInput; /** 如果是textArea的话，const { textAreaRef } = this.passWord;*/
            input.focus();
        }
    }

    /* 设置input获得焦点 */
    setInputFocus = (currentInput) => {
        let { input } = currentInput;
        input.focus();
    }

    // 登录密码获取科室
    getDepartmentListByLogin = (e, callback) => {
        let userName = this.props.form.getFieldValue('userName');
        let password = this.props.form.getFieldValue('passWord');
        if (userName && password && password != '' && userName != '') {
            /** 判断是否已经缓存了用户名、密码 */
            if ((userName == this.state.bakUserName) && (password == this.state.bakPassword)) {
                this.setState({ disabled: false });
                return;
            } else {
                this.setState({ disabled: true });
            }

            this.props.form.validateFields((err, values) => {
                if (!err) {
                    let data = {
                        "params": [{
                            "userName": userName,
                            "passWord": Aes.Encrypt(password)
                        }],
                        "session": [{
                            "loginIp": window.location && window.location.protocol && window.location.host ? (window.location.host.split(":")[0]) : (window.location && window.location.origin ?
                                (window.location.origin.split(":")[0] + window.location.origin.split(":")[1]).split("//")[1] : "")
                        }]
                    };
                    $http.post('urlDeault', this, {
                        code: "1001",
                        data: data,
                        success: function (res) {
                            let errorCode = res.errorCode;
                            if (errorCode === '0') {
                                let result = res.result[0];
                                // 是否需要修改密码
                                if (result.changeFlag === 'Y') {
                                    let thisParse = this
                                    Modal.warning({
                                        title: language.LoginLoginErr6 && language.LoginLoginErr6.descripts,
                                        content: result.changeDesc,
                                        onOk() {
                                            thisParse.props.history.push({ pathname: "/ChangePassword", state: { userCode: result.userCode, userID: result.userID } });
                                        },
                                    });
                                    return false;
                                }
                                this.setState({
                                    defaultValues: {
                                        userCode: result.userCode,
                                        departmentId: result.locID,
                                        userId: result.userID,
                                    },
                                    userLogonType: result.userLogonType,
                                    bakUserName: userName,
                                    bakPassword: password,
                                }, () => {
                                    callback && callback(e);
                                })
                                if (result.othLocFlag === "Y") {
                                    this.setState({
                                        disabled: false, // 开发科室选择
                                    })
                                }
                                let defaultValues = {
                                    logonLocDesc: result.locDesc,
                                    logonLocID: result.locID,
                                    logonGroupDesc: result.groupDesc,
                                    logonGroupID: result.groupID,
                                    logonHospDesc: result.hospDesc,
                                    logonHospID: result.hospID,
                                }
                                /**set 默认科室信息 */
                                this.setDepartmentValues(defaultValues);
                                /**设置查询修改ip地址 */
                                this.getIpAddressByHospitalId(result.hospID);
                                /** 加载当前用户下所有的角色列表 */
                                this.child.getDepartmentList(result.userCode, this.state.languageCode, result.userID);
                            } else {
                                this.setState({
                                    visibleCode: 'none',// 验证码框
                                })
                            }
                        }
                    });
                }
            })
        }
    }

    /** 根据医院Id 获取服务器IP地址 */
    getIpAddressByHospitalId = (hospitalId, resData) => {
        $http.post('urlDeault', this, {
            code: "1009",
            data: {
                "params": [{
                    hospID: hospitalId
                }]
            },
            success: function (res) {
                let errorCode = res.errorCode;
                let ipConfig = {};   // ip地址对象
                ipConfig.productIP = res.result[0].productIP   //增删改地址
                ipConfig.queryIP = res.result[0].queryIP   //查询库地址
                if (errorCode === '0') {
                    store.dispatch({
                        type: 'loginConfigData',
                        value: ipConfig
                    })

                    window.sessionStorage.setItem("productIP", res.result[0].productIP);
                    window.sessionStorage.setItem("queryIP", res.result[0].queryIP);
                    window.sessionStorage.setItem("EMRIP", res.result[0].EMRIP);

                    if (resData) {
                        setTimeout(this.handleISSaveUserName(resData), 1000);   // 登录方法
                    }
                }
            }
        });
    }

    /* set 当前选择的角色 */
    setDepartmentValues = (data) => {
        this.setState({
            visible: false,
            depId: data.logonLocID, // 角色科室id
            loginId: data.logonLocID, // 科室id
            groupId: data.logonGroupID, // 角色id
            hospDrId: data.logonHospID, // 医院id
            groupType: data?.logonGroupType || '', // 角色类型
            openSelect: false,
            selectedValue: data.logonLocDesc + ' | ' + data.logonGroupDesc + ' | ' + data.logonHospDesc
            // selectedValue: data.logonLocDesc + ' | ' + data.logonHospDesc + ' | H34010202798'
        });
    }

    // 验证码
    changeEvent = (e) => {
        let { language } = this.state
        this.setState({
            verificationCode: e.target.value,
        });
        if (e.target.value.length > 0) {
            this.setState({
                codeHelp: '',
                codeStatus: ''
            });
        } else {
            this.setState({
                codeHelp: language.LoginLoginCode && language.LoginLoginCode.descripts,
                codeStatus: 'error'
            });
        }
    }

    contentHeight = (e) => {
        let contentH = parseInt(document.body.clientHeight);
        let contentW = parseInt(document.body.clientWidth);
        this.setState({
            contentH,
            contentW
        })
    }

    // 用户名失去焦点事件
    handleUserNameClick = () => {
        let { userNameList } = this.state;
        this.setState({ popoverVisible: userNameList && userNameList.length > 0 ? true : false })
    }

    handleUserNameBlur = () => {
        let { popoverVisible } = this.state;
        setTimeout(() => {
            popoverVisible ? this.setState({ popoverVisible: false }) : '';
        }, 300)
    }

    /** 重新输入用户名时，重置form表单数据 */
    resetForm = (e) => {
        this.props.form.setFieldsValue({
            passWord: '',
        });

        this.setState({
            selectedValue: '',
            visibleCode: 'none',
            disabled: true,
            popoverVisible: e.target.value ? false : true
        });
    }

    EndLogin = () => {
        // 登录接口
        let ifconfig;/** 设置默认值 */
        if (window.sessionStorage.getItem("ipConfig") === 'undefined') {
            ifconfig = {};
        } else {
            ifconfig = JSON.parse(window.sessionStorage.getItem("ipConfig"));
        }
        let data = {
            "params": [{
                "userName": this.props.form.getFieldValue('userName'),
                "passWord": Aes.Encrypt(this.props.form.getFieldValue('passWord')),
                "loginLocID": this.state.loginId,
                "loginGroupID": this.state.groupId,
                "loginHospID": this.state.hospDrId,
                "deviceID": ifconfig.hostName,
                "IP": ifconfig.ipv4,
                "userLogonType": this.state.userLogonType,
                "mac": ifconfig.mac,
            }]
        };
        $http.post('urlDeault', this, {
            code: "1011",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    let logReg = res;
                    if (this.state.visibleCode == "block") {
                        //验证验证码是否一致
                        let data = {
                            "params": [{
                                verifyCode: this.state.verificationCode && this.state.verificationCode || "",
                                typeCode: "HisUser",
                                flag: "N",
                                userCode: this.props.form.getFieldValue('userName'),
                            }]
                        };
                        $http.post('urlDeault', this, {
                            code: "1014",
                            data: data,
                            success: function (res) {
                                let errorCode = res.errorCode;
                                if (errorCode == '0') {
                                    this.handleISSaveUserName(logReg)  // 登录方法
                                } else {
                                    // message.warning("验证码不正确,请重新输入")
                                }
                            }
                        });
                    } else {
                        this.handleISSaveUserName(res)  // 登录方法
                    }
                    this.checkfileUpdate();     // 点登录时进行dll的下载和更新
                }
            }
        });

    }

    goVideo = () => {
        this.setState({
            translate3d: -(657)
        }, () => {
            this.faceID() // 开启人脸识别
        })
    }

    goLogin = () => {
        this.setState({
            translate3d: 0
        })
        let video = document.querySelector("#video");
        video.srcObject.getTracks()[0].stop(); //关闭摄像头
        clearInterval(this.timerID); // 移除定时器
    }

    // 是否需要CA登录
    ISCA = (callback) => {
        let activeFlag = false;
        let data = {
            "params": [{
                "hospID": this.state.hospDrId,
                "locID": this.state.loginId,
                "logonType": "01"
            }]
        };

        $http.post('urlDeault', this, {
            code: "08010003",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    if (res.result && res.result.activeFlag === 1) { // 1
                        activeFlag = true
                    } else {
                        activeFlag = false
                    }
                    callback(activeFlag)
                }
            }
        });
    }

    qR = (type) => {
        clearInterval(this.setint); // 移除定时器
        let data = {
            "params": [{
                "hospID": "1"
            }]
        };

        $http.post('urlDeault', this, {
            code: "08010001",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    var requestId = res.result.requestId
                    var timeout = res.result.timeout


                    this.setint = setInterval(() => {

                        if (timeout == 0) {
                            clearInterval(this.setint); // 移除定时器
                            this.setState({ scale: 0, qRVis: false })
                        } else {
                            timeout--;
                            this.setState({
                                qRTime: timeout
                            })
                        }
                    }, 1000);

                    this.setState({
                        qR: type,
                        qRVis: true,
                        scale: 1,
                        QRImg: res.result.imgBase64 || "",
                    }, () => {
                        if (type === 'CA') {
                            this.logonCA(requestId, timeout)
                        } else {
                            this.logonQR(requestId, timeout)
                        }
                    })
                }
            }
        });
    }

    // CA 登录
    logonCA = (requestId, timeout) => {
        let { defaultValues, language } = this.state
        // 初始值下拉列表值
        let data = {
            "params": [
                {
                    "requestId": requestId,
                    "timeout": timeout,
                    "hospID": this.state.hospDrId,
                    "userCode": defaultValues.userCode,
                }
            ]
        };
        $http.post('urlDeault', this, {
            code: "08010004",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    this.setState({
                        faceUserData: res.result[0] || {},
                        faceTrue: true
                    }, () => {
                        this.EndLogin()
                    })
                }
            }
        });
    }

    // 二维码 登录
    logonQR = (requestId, timeout) => {
        let { language } = this.state
        let ifconfig = JSON.parse(window.sessionStorage.getItem("ipConfig"));
        // 初始值下拉列表值
        let data = {
            "params": [
                {
                    "requestId": requestId,
                    "timeout": timeout,
                    "hospID": 1,
                    "IP": ifconfig.ipv4,
                    "deviceID": ifconfig.hostName,
                    "mac": ifconfig.mac,
                }
            ]
        };

        $http.post('urlDeault', this, {
            code: "08010002",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode === '0') {
                    this.setState({
                        faceUserData: res.result[0] || {},
                        faceTrue: true
                    }, () => {
                        /**设置查询修改ip地址 */
                        this.getIpAddressByHospitalId(res.result[0].hospID, res);
                        message.success(language.LoginLoginFaceSuccess && language.LoginLoginFaceSuccess.message, this.state.userData && this.state.userData.messageTime)
                    })
                }
            }
        });
    }

    helpDown = () => {
        // 服务下载地址
        window.location.href = httpConfig.DownUrl
    }

    //点击切换中英文
    handleLanguage = (languageCode) => {
        this.setState({
            languageCode: languageCode === "CN" ? "EN" : "CN",
        }, () => {
            this.LanCNEN(this.state.languageCode)
        })
    }

    // 登录表单提交
    handleSubmit = (e) => {
        let { language, groupType } = this.state
        e.preventDefault();
        this.props.form.validateFields((err, values) => {
            if (!err) {
                if (this.state.visibleCode === 'block' && this.state.verificationCode.length < 1) {
                    this.setState({
                        codeHelp: language.LoginLoginCode && language.LoginLoginCode.descripts,
                        codeStatus: 'error'
                    });
                    setInputFocus(this.code);
                    return false;
                }
                if (groupType) {
                    this.getWindowOpenData();
                } else {
                    this.handleHISLogin();
                }
            }
        });
    }

    /**
     * @ByShizi: 根据角色类型获取第三方跳转地址
     * Create 2023-02-24
     * */
    getWindowOpenData = async () => {
        try {
            const { groupId } = this.state;
            let data = {
                params: [{
                    userCode: this.props.form.getFieldValue('userName'),
                    groupID: groupId,
                }]
            }
            let res = await React.$asyncPost(this, '01040309', data);
            let jumpUrl = res.result?.jumpUrl || '';
            if (jumpUrl) {
                window.open(jumpUrl, '_self');
            } else {
                this.handleHISLogin(); // 没返回跳转路径则登录默认系统
            }
        } catch (error) {
            console.log(error);
        }
    }

    handleHISLogin = () => {
        this.ISCA((activeFlag) => { // 是否ca登录
            if (activeFlag) {
                this.qR('CA')
                return false
            } else {
                this.EndLogin()
            }
        })
    }

    // 发送验证码
    sendMobileCode = () => {
        const { languageCode } = this.state
        let data = {
            params: [{
                typeCode: "HisUser",
                flag: "N",
                userCode: this.props.form.getFieldValue('userName'),
                hospID: this.state.hospDrId && this.state.hospDrId || "",
            }]
        };
        $http.post('urlDeault', this, {
            code: "1013",
            data: data,
            success: function (res) {
                let errorCode = res.errorCode;
                if (errorCode == '0') {
                    this.handleClick();
                    if (languageCode && languageCode === "CN" || languageCode === "") {
                        message.success(res.errorMessage, this.state.userData && this.state.userData.messageTime);
                    } else {
                        message.success("Verification code sent successfully", this.state.userData && this.state.userData.messageTime);
                    }

                }
            }
        });
    }

    //点击验证码按钮
    handleClick = () => {
        const { sendMsg } = this.props;
        const { liked } = this.state;
        if (!liked) {
            return;
        }
        this.countDown();
    };

    //数值下降
    countDown = () => {
        const { count } = this.state;
        if (count === 1) {
            this.setState({
                count: 60,
                liked: true,
            });
        } else {
            this.setState({
                count: count - 1,
                liked: false,
            });
            setTimeout(this.countDown.bind(this), 1000);
        }
    }

    handleSwitch = (type, mobile) => {
        this.setState({ switchType: type }, () => {
            if (mobile) {
                this.setState({ selectedValue: "" });
                this.props.form.setFieldsValue({ userName: mobile })
            }
        })
    }

    // 是否保存用户名
    handleSaveUserNameChange = e => {
        let isSaveUserName = e.target.checked;
        this.setState({ isSaveUserName });
        window.localStorage.setItem('isSaveUserName', isSaveUserName ? 'Y' : 'N');
    }

    // 选择用户名带入到输入框中
    handlePopoverItemClick = (item, e) => {
        e?.stopPropagation();
        try {
            this.setState({ popoverVisible: false, selectedValue: '', visibleCode: 'none', disabled: true, }, () => {
                this.props.form.setFieldsValue({
                    userName: item,
                    passWord: undefined
                });
                this.setInputFocus(this.passWord);
                this.child?.clearTableData();
            })
        } catch (error) {
            console.log(error)
        }
    }

    /**
    * @ByShizi: 点击弹窗角色选择
    * 需求 #968
    * Create 2022-10-08
    */
    handleDepartmentClick = () => {
        const { openSelect } = this.state;
        if (!openSelect) {
            this.setState({ openSelect: true });
        }
    }

    // 角色框失去焦点事件
    handleDepartmentBlur = () => {
        this.setState({ currentSelectedValue: undefined });
    }

    // 角色框获取焦点事件
    handleDepartmentFocus = () => {
        this.child && this.child.handlePressEnter('');
    }

    // 角色框change事件
    handleDepartmentChange = e => {
        this.setState({ currentSelectedValue: e.target.value })
    }

    // 角色框回车事件
    handleDepartmentPressEnter = (e) => {
        this.child && this.child.handlePressEnter(e);
    }

    render() {
        const { getFieldDecorator } = this.props.form;
        let { languageCode, language, imgUrl, contentH, switchType, userNameList, isSaveUserName, popoverVisible, openSelect, selectedValue, currentSelectedValue } = this.state;

        const popoverContent = (
            <ul className='login-popover'>
                {userNameList && userNameList.map((item, index) => {
                    return (
                        <li key={index} onClick={(e) => this.handlePopoverItemClick(item, e)}>{item}</li>
                    )
                })}
            </ul>
        )
        return (
            <div className="login" style={{ height: contentH + 'px' }}>
                <div className="loginBody" >
                    <div style={{ height: '100%', width: "100%", overflow: 'hidden' }} >
                        <div style={{ opacity: '1', transition: 'all .5s', height: "100%", transform: `translate3d(0px, ${this.state.translate3d}px, 0px)` }}>
                            <div>
                                <div className="loginBox" style={{ height: "657px" }}>
                                    {/* display: this.state.qRVis ? 'block' : 'none', */}
                                    <div className='qR' style={{ transform: `scale(${this.state.scale})` }} onClick={() => this.setState({ scale: 0, qRVis: false })}>
                                        <img src={this.state.QRImg} />
                                        <div className='p'>
                                            <p>请使用{this.state.qR}扫描二维码登录</p>
                                            <p>有效时间&nbsp;&nbsp;<span style={{ color: '#007AFF' }}> {this.state.qRTime}S</span></p>
                                        </div>

                                    </div>
                                    <Carousel className="carou" >
                                        <div>
                                            <div className="lgBg1 bg" style={{ height: "657px", padding: "24px 0 0 12px", boxSizing: "border-box" }}>
                                                {/*<img alt="" src={loginLogo} style={{ width: "191px", height: "57px" }} />*/}
                                            </div>
                                        </div>
                                    </Carousel>
                                </div>
                                <div className="loginBox" style={{ height: "657px", padding: '48px 24px', boxSizing: "border-box" }}>
                                    <div className="loginBoxTab">
                                        <div className={switchType === "login" ? "select loginBoxTabChild" : "loginBoxTabChild"}>
                                            <span onClick={() => this.handleSwitch("login")}>{language.LoginLogin && language.LoginLogin.descripts || `登录`}</span>
                                        </div>
                                        <div className="tabDivider" />
                                        <div className={switchType === "register" ? "select loginBoxTabChild" : "loginBoxTabChild"}>
                                            <span onClick={() => this.handleSwitch("register")}>
                                                注册
                                            </span>
                                        </div>
                                    </div>
                                    {switchType === "login" ? <Form onSubmit={this.handlePreLogin} className="login-form ">
                                        <Row style={{ marginTop: "60px" }}>
                                            <Col span={24} id="login-user-name">
                                                <Form.Item>
                                                    {getFieldDecorator('userName', {
                                                        initialValue: '',
                                                        rules: [{ required: true, message: language.LoginLoginErr1 && language.LoginLoginErr1.descripts }],
                                                    })(
                                                        <Input
                                                            size="large"
                                                            allowClear={true}
                                                            prefix={<Icon type="user" />}
                                                            onChange={(e) => { this.resetForm(e) }}
                                                            ref={(input) => { this.userName = input; }}
                                                            onBlur={this.handleUserNameBlur}
                                                            onClick={this.handleUserNameClick}
                                                            onPressEnter={(e) => { this.enterInputNextFocus(e, this.passWord, 'userName') }}
                                                            placeholder={language.LoginLoginErr1 && language.LoginLoginErr1.descripts || `请输入工号/手机号/用户名`}
                                                        />
                                                    )}
                                                </Form.Item>
                                                <Popover
                                                    placement="rightTop"
                                                    visible={popoverVisible}
                                                    content={popoverContent}
                                                    overlayClassName="login-user-name-popover"
                                                    getPopupContainer={() => document.getElementById('login-user-name')}
                                                >
                                                </Popover>
                                            </Col>
                                        </Row>
                                        <Row>
                                            <Col span={24}>
                                                <Form.Item >
                                                    {getFieldDecorator('passWord', {
                                                        initialValue: '',
                                                        rules: [{ required: true, message: language.LoginLoginErr2 && language.LoginLoginErr2.message }, { pattern: /^.{6,12}$/, message: language.LoginLoginErr2 && language.LoginLoginErr2.descripts }, { pattern: /^(?=.*[0-9])(?=.*[a-zA-Z])(.{6,12})$/, message: language.LoginLoginErr4 && language.LoginLoginErr4.descripts }, { pattern: /^(?:(?!(.+)\1{2,}).)+$/, message: language.LoginLoginErr8 && language.LoginLoginErr8.descripts }],
                                                    })(
                                                        <Input.Password
                                                            allowClear={true}
                                                            size="large"
                                                            ref={(input) => { this.passWord = input; }}
                                                            maxLength={12}
                                                            prefix={<Icon type="lock" />}
                                                            type="password"
                                                            placeholder={language.LoginLoginErr2 && language.LoginLoginErr2.message || `请输入密码`}
                                                            onKeyUp={(e) => { this.handleEnterPassword(e); }}
                                                            onBlur={(e) => { this.getDepartmentListByLogin(e) }}
                                                        />
                                                    )}
                                                </Form.Item>
                                            </Col>
                                        </Row>
                                        {/* <Row>
                                            <Col span={24}>
                                                <Form.Item >
                                                    {getFieldDecorator('insuCode', {
                                                        initialValue: 'D340172018595',
                                                    })(
                                                        <Input placeholder="医保编码" size="large" disabled prefix={<Icon type="insurance" style={{ fontSize: '16px' }} />} />
                                                    )}
                                                </Form.Item>
                                            </Col>
                                        </Row> */}
                                        <Row>
                                            <Col span={24} >
                                                <Tooltip placement="right" title={language.LoginLoginTip && language.LoginLoginTip.descripts} visible={this.state.defaultVisible} overlayStyle={{ zIndex: 99999 }}>
                                                    <Form.Item>
                                                        <Input
                                                            size="large"
                                                            name="department"
                                                            className="department"
                                                            autoComplete="off" // 不记录历史信息
                                                            prefix={<Icon type="bars" />}
                                                            disabled={this.state.disabled}
                                                            readOnly={openSelect ? '' : 'readOnly'}
                                                            title="可输入科室/角色/医院回车查询，支持首拼检索"
                                                            value={openSelect ? currentSelectedValue : selectedValue}
                                                            placeholder={openSelect ? selectedValue : (language.LoginLoginErr3 && language.LoginLoginErr3.descripts || `请选择医院/科室/角色`)}
                                                            onBlur={this.handleDepartmentBlur}
                                                            onFocus={this.handleDepartmentFocus}
                                                            onClick={this.handleDepartmentClick}
                                                            onChange={this.handleDepartmentChange}
                                                            onPressEnter={this.handleDepartmentPressEnter}
                                                        />
                                                        <div style={{ position: 'absolute', width: 420, zIndex: 999, display: this.state.openSelect === true ? '' : 'none' }}>
                                                            <DepartmentList onRef={this.onRef} defaultValues={this.state.defaultValues} setDepartmentValues={this.setDepartmentValues} />
                                                        </div>
                                                    </Form.Item>
                                                </Tooltip>
                                            </Col>
                                        </Row>
                                        <Row style={{ display: this.state.visibleCode }}>
                                            <Col span={12}>
                                                <Form.Item help={this.state.codeHelp} validateStatus={this.state.codeStatus} >
                                                    <Input size="large" ref={(input) => { this.code = input; }}
                                                        prefix={<Icon type="safety-certificate" />}
                                                        placeholder={language.LoginLoginCode && language.LoginLoginCode.descripts}
                                                        onChange={(e) => this.changeEvent(e)}
                                                        value={this.state.verificationCode}
                                                    />
                                                </Form.Item>
                                            </Col>
                                            <Col span={languageCode && languageCode === "CN" || languageCode === "" ? 8 : 10} offset={languageCode && languageCode === "CN" || languageCode === "" ? 4 : 2}>
                                                <div className="codeImg"
                                                    disabled={!this.state.liked}
                                                    style={{ color: !this.state.liked ? '#BEBEBE' : '' }}
                                                    onClick={this.state.liked ? this.sendMobileCode : ''}>
                                                    {
                                                        languageCode && languageCode === "CN" || languageCode === "" ? (this.state.liked ? '获取验证码' : `${this.state.count} 秒后重发`)
                                                            : (this.state.liked ? 'get verification code' : `${this.state.count} seconds to resend`)
                                                    }
                                                </div>
                                            </Col>
                                        </Row>
                                        {/* <Row style={{ marginTop: "8px" }}> */}
                                        <Row style={{ marginTop: "16px" }}>
                                            <Col span={24}>
                                                <div style={{ marginBottom: 6 }}>
                                                    <Checkbox checked={isSaveUserName} onChange={this.handleSaveUserNameChange}>记住用户名</Checkbox>
                                                </div>
                                                <Button onClick={this.handlePreLogin} className="login-form-button">{language.LoginLogin && language.LoginLogin.descripts || `登 录`}</Button>
                                            </Col>
                                            <Col span={24}>
                                                <div className="textR" style={{ height: '30px' }} >
                                                    <span className="spanHrefNew" style={{ lineHeight: '30px' }}>
                                                        <Link to='/ChangePassword' >{language.LoginLoginForget && language.LoginLoginForget.descripts || `修改密码/忘记密码`}</Link>
                                                    </span>
                                                </div>
                                            </Col>
                                        </Row>
                                        {/* <Row style={{ marginTop: "24px" }}> */}
                                        <Row style={{ marginTop: "60px" }}>
                                            <Col span={24}>
                                                <Divider className="otherDiv">{language.LoginLoginOther && language.LoginLoginOther.descripts || `其他登录方式`}</Divider>
                                            </Col>
                                        </Row>
                                        <Row style={{ fontSize: "12px" }}>
                                            <Col span={8} className="textC otherHover curP" onClick={this.goVideo}>
                                                <DisIcon style={{ fontSize: "23px", color: "#FF8E00" }} />
                                                <p>{language.LoginLoginFace && language.LoginLoginFace.descripts || `人脸识别`}</p>
                                            </Col>
                                            <Col span={8} className="textC otherHover curP" onClick={() => this.qR(language.LoginLoginWeChat && language.LoginLoginWeChat.descripts)}>
                                                <Icon type="wechat" theme="filled" style={{ fontSize: "25px", color: "#23BF36" }} />
                                                <p>{language.LoginLoginWeChat && language.LoginLoginWeChat.descripts || `医网信`}</p>
                                            </Col>
                                            <Col span={8} className="textC otherHover curP" >
                                                <Icon type="alipay-circle" theme="filled" style={{ fontSize: "25px", color: "#1296DB" }} />
                                                <p>{language.LoginLoginAlipay && language.LoginLoginAlipay.descripts || `支付宝`}</p>
                                            </Col>
                                        </Row>
                                    </Form> : <Register handleSwitch={this.handleSwitch} />}
                                    <Modal visible={this.state.visibleIp} footer={null} closable={false} keyboard={false} style={{ textAlign: 'center' }}>
                                        <p style={{ fontSize: '18px', textAlign: 'center' }}><Icon type="close-circle" theme="filled" style={{ color: '#f5222d', marginRight: '10px' }} />{language.LoginLoginErr5 && language.LoginLoginErr5.descripts}</p>
                                        <Button className="login-form-button" size='large' style={{ width: '200px', margin: '0 auto' }} onClick={() => this.helpDown()}><Icon type="download" style={{ color: '#fff' }} />{language.LoginLoginDown && language.LoginLoginDown.descripts}</Button>
                                    </Modal>
                                </div>
                            </div>
                            <div style={{ textAlign: 'center' }}>
                                <div className="loginBox" style={{ background: '#000' }}>
                                    <video id="video" width="100%" height={657} >
                                    </video>
                                    <canvas id="canvas" width={'100%'} height={657}></canvas>
                                </div>
                                <div className="loginBox" style={{ height: "657px" }}>
                                    <p className='callbackP' onClick={this.goLogin} ><Icon type="rollback" /> {language.LoginLoginCall && language.LoginLoginCall.descripts} </p>
                                    <Row>
                                        <Col span={8} offset={8} className="mT30">
                                            <Button onClick={() => this.faceID()} className="login-form-button" size='large'><Icon type="video-camera" style={{ color: '#fff' }} />
                                                {language.LoginLoginStart && language.LoginLoginStart.descripts}</Button>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <Col span={24} className="mT20" style={{ display: this.state.faceTrue ? 'block' : 'none', color: "rgb(48, 173, 105)", fontSize: '20px' }}>
                                            {language.LoginLoginFaceSuccess && language.LoginLoginFaceSuccess.descripts}...
                                        </Col>
                                    </Row>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div className="login-footer">
                    {httpConfig.Copyright}
                </div>
            </div>

        );
    }
};

const LoginFrom = Form.create()(Login);
export default LoginFrom
